﻿@page "/docs/extensions/datagrid/validations"

<DocsPageTitle>
    DataGrid : Validations
</DocsPageTitle>

<DocsPageSection>
    <DocsPageSectionHeader Title="Validations">
        <Paragraph>
            The <Code>DataGrid</Code> provides validations of column values at editing or creating items. For using validation of <Code>DataGrid</Code> you have to use these properties:
        </Paragraph>
        <ul>
            <li><Code>UseValidation</Code> must be set to true to enable validation.</li>
            <li><Code>ShowValidationFeedback</Code> of DataGrid to hide or show feedback for validation.</li>
            <li><Code>ShowValidationsSummary</Code> of DataGrid to hide or show validations summary.</li>
            <li><Code>ValidationsSummaryLabel</Code> of DataGrid to set label of validations summary.</li>
            <li><Code>Validator</Code> of <Code>DataGridColumn</Code> validates the input value after trying to save.</li>
            <li><Code>ValidationPattern</Code> of <Code>DataGridColumn</Code> forces validation to use regex pattern matching instead of default validator handler.</li>
        </ul>
        By default, <Code>DataGrid</Code> will use data-annotation to validate editing fields. You only need to define them on your model and they will automatically be picked up by the grid.
    </DocsPageSectionHeader>
    <DocsPageSectionSource Code="DataGridAnnotationExample" />
    <DocsPageSectionContent>
        <Alert Visible="true" Color="Color.Warning">
            <AlertDescription>
                <Strong>Note:</Strong> Don’t forget to enable validation by setting <Code>UseValidation="true"</Code>.
            </AlertDescription>
        </Alert>
    </DocsPageSectionContent>
    <DocsPageSectionContent>
        To override data-annotation you only need to define a <Code>Validator</Code> attribute and assign it to your validation method.
        <DataGridValidatorExample />
    </DocsPageSectionContent>
    <DocsPageSectionSource Code="DataGridValidatorExample" />
    <DocsPageSectionContent>
        If you use <Code>EditTemplate</Code> to customize editing of columns, then using <Code>Validator</Code> or <Code>ValidationPattern</Code> will not work and you have to use <Code>Validation</Code> like in the following example:
        <DataGridValidatorEditTemplateExample />
    </DocsPageSectionContent>
    <DocsPageSectionSource Code="DataGridValidatorEditTemplateExample" />
</DocsPageSection>